<!DOCTYPE html>
<html xmlns:th="www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<div th:fragment="headHtml">
	<!--Begin Header Begin-->
	<div class="soubg">
		<div class="sou">
			<!--Begin 所在收货地区 Begin-->
			<span class="s_city_b"> <span class="fl">送货至：</span> <span
				class="s_city"> <span>四川</span>
					<div class="s_city_bg">
						<div class="s_city_t"></div>
						<div class="s_city_c">
							<h2>请选择所在的收货地区</h2>
							<table border="0" class="c_tab"
								style="width: 235px; margin-top: 10px;" cellspacing="0"
								cellpadding="0">
								<tr>
									<th>A</th>
									<td class="c_h"><span>安徽</span><span>澳门</span></td>
								</tr>
								<tr>
									<th>B</th>
									<td class="c_h"><span>北京</span></td>
								</tr>
								<tr>
									<th>C</th>
									<td class="c_h"><span>重庆</span></td>
								</tr>
								<tr>
									<th>F</th>
									<td class="c_h"><span>福建</span></td>
								</tr>
								<tr>
									<th>G</th>
									<td class="c_h"><span>广东</span><span>广西</span><span>贵州</span><span>甘肃</span></td>
								</tr>
								<tr>
									<th>H</th>
									<td class="c_h"><span>河北</span><span>河南</span><span>黑龙江</span><span>海南</span><span>湖北</span><span>湖南</span></td>
								</tr>
								<tr>
									<th>J</th>
									<td class="c_h"><span>江苏</span><span>吉林</span><span>江西</span></td>
								</tr>
								<tr>
									<th>L</th>
									<td class="c_h"><span>辽宁</span></td>
								</tr>
								<tr>
									<th>N</th>
									<td class="c_h"><span>内蒙古</span><span>宁夏</span></td>
								</tr>
								<tr>
									<th>Q</th>
									<td class="c_h"><span>青海</span></td>
								</tr>
								<tr>
									<th>S</th>
									<td class="c_h"><span>上海</span><span>山东</span><span>山西</span><span
										class="c_check">四川</span><span>陕西</span></td>
								</tr>
								<tr>
									<th>T</th>
									<td class="c_h"><span>台湾</span><span>天津</span></td>
								</tr>
								<tr>
									<th>X</th>
									<td class="c_h"><span>西藏</span><span>香港</span><span>新疆</span></td>
								</tr>
								<tr>
									<th>Y</th>
									<td class="c_h"><span>云南</span></td>
								</tr>
								<tr>
									<th>Z</th>
									<td class="c_h"><span>浙江</span></td>
								</tr>
							</table>
						</div>
					</div>
			</span>
			</span>
			<!--End 所在收货地区 End-->
			<span class="fr"> 
				<span class="fl" th:if="${session.loginUser == null}">你好，请
				<a href="toLogin.do">登录</a>&nbsp; 
					<a href="toRegister.do" style="color: #ff4e00;">免费注册</a>&nbsp;|&nbsp;
					<a href="MemberOrder.do">我的订单</a>&nbsp;|
				</span>
				<span class="fl" th:if="${session.loginUser != null}">欢迎，
					<a href="member" th:text="${session.loginUser.trueName}">登录</a>&nbsp;|&nbsp;
					<a href="loginOut.do">退出登录</a>&nbsp;|&nbsp;
					<a href="MemberOrder.do">我的订单</a>&nbsp;|
				</span>
				<span class="ss">
					<div class="ss_list">
						<span>收藏夹</span>
						<div class="ss_list_bg">
							<div class="s_city_t"></div>
							<div class="ss_list_c">
								<ul>
									<li><a href="favorite">收藏的宝贝</a></li>		
								</ul>
							</div>
						</div>
					</div>
					<div class="ss_list">
						<a href="#">客户服务</a>
						<div class="ss_list_bg">
							<div class="s_city_t"></div>
							<div class="ss_list_c">
								<ul>
									<li><a href="member">个人信息</a></li>
									<li><a href="#">客户服务</a></li>
									<li><a href="#">客户服务</a></li>
								</ul>
							</div>
						</div>
					</div>
					<div class="ss_list">
						<a href="#">网站导航</a>
						<div class="ss_list_bg">
							<div class="s_city_t"></div>
							<div class="ss_list_c">
								<ul>
									<li><a href="#">网站导航</a></li>
									<li><a href="#">网站导航</a></li>
								</ul>
							</div>
						</div>
					</div>
			</span> <span class="fl">|&nbsp;关注我们：</span> <span class="s_sh"><a
					href="#" class="sh1">新浪</a><a href="#" class="sh2">微信</a></span> <span
				class="fr">|&nbsp;<a href="#">手机版&nbsp;<img
						src="images/s_tel.png" align="absmiddle" /></a></span>
			</span>
		</div>
	</div>
	<div class="top">
		<div class="logo">
			<a href="index"><img src="images/logo.png" /></a>
		</div>
		<div class="search">
			<form>
				<input type="text" value="" class="s_ipt" /> <input type="submit"
					value="搜索" class="s_btn" />
			</form>
			<span class="fl"><a href="#">咖啡</a><a href="#">iphone 6S</a><a
				href="#">新鲜美食</a><a href="#">蛋糕</a><a href="#">日用品</a><a href="#">连衣裙</a></span>
		</div>
		<div class="i_car">
			<div class="car_t" >
				<div th:if="${clist == null or clist.size() eq 0}">
					购物车 [ <span>0</span> ]
				</div>
				<div th:if="${clist != null or clist.size() gt 0}" th:each="car,cStat:${clist}">
					购物车 [ <span th:text="${cStat.size}"></span> ]
				</div>
			</div>
			<div class="car_bg">
				<!--Begin 购物车未登录 Begin-->
				<div class="un_login" th:if="${clist eq null or clist.size() eq 0}">
					还未登录！<a href="toLogin.do" style="color: #ff4e00;">马上登录</a> 查看购物车！
				</div>
				<!--End 购物车未登录 End-->
				<div th:if="${clist != null && clist.size() gt 0}">
					<!--Begin 购物车已登录 Begin-->
					<ul class="cars">
						<li th:each="car,cStat:${clist}">
								<div class="img">
									<a th:href="@{'/product?id='+${car.productSpecs.products.id}}"><img th:src="${car.productSpecs.image.get(0).url}" width="58" height="58" /></a>
								</div>
							<div th:each="list:${car.productSpecs}">
								<div th:each="plist,pStat:${car.productSpecs.products}">
									<div class="name">
										<span><a th:href="@{'/product?id='+${plist.id}}" th:text="${plist.name}"></a></span>
									</div>
									<div class="price">
										<font color="#ff4e00">￥&nbsp;<span
											th:text="${list.productPrice}"></span></font>&nbsp;&nbsp;X&nbsp;<span
											th:text="${car.count}"></span>
									</div>
									<span style="display: none" th:class="'prices'+${cStat.index}"
										th:text="${#aggregates.sum({car.count*list.productPrice})}"></span>

								</div>
							</div>

						</li>
					</ul>
					<div>
						<div class="price_sum">
							共计&nbsp; <font color="#ff4e00">￥</font> <span id="totalPrice"></span>

						</div>
						<script th:inline="javascript">
							var size = [[${clist.size()}]];
							var totalPrice = 0;
							for(i = 0; i < size; i++){
								console.log(jQuery('.prices'+i).text());
								totalPrice +=Number(jQuery('.prices'+i).text());
							}
							jQuery('#totalPrice').html(totalPrice);
							console.log(totalPrice);
	                   </script>
					</div>
					<div class="price_a">
						<a href="BuyCar.do">去购物车结算</a>
					</div>
				</div>
				<!--End 购物车已登录 End-->
			</div>
		</div>
	</div>


	<!--End Header End-->
	<!--Begin Menu Begin-->
	<div class="menu_bg">
		<div class="menu">
			<!--Begin 商品分类详情 Begin-->
			<div class="nav">
				<div class="nav_t">全部商品分类</div>
				<div class="leftNav" style="display: none;">
					<ul>
						<li th:each="blists,bStat:${btlist}"><span class="showTool"
							th:text="${bStat.count}" style="display: none;"></span>
							<div class="fj">
								<span th:each="blists:${bStat.current}"> <span class="fl"
									th:text="'&nbsp;'+'&nbsp;'+${blists.name}+'&nbsp;'+'|'"></span>
								</span>
							</div>
						</li>
					</ul>
					<div class="zj">
						<div th:class="'bStat'+${bStat.count}"
							th:each="blists,bStat:${btlist}" style="display: none;">
							<div class="zj_l">

								<div class="zj_l_c" th:each="blists:${bStat.current}">
									<h2 ><a th:text="${blists.name}"></a></h2>
									<span th:each="st:${blists.small}"> 
									<a th:href="'/categorylist?id='+${st.id}" th:text="${st.name}"></a>|
									</span>
								</div>
							</div>
							<div class="zj_r">
								<a href="#"><img src="images/n_img1.jpg" width="236"
									height="200" /></a> <a href="#"><img src="images/n_img2.jpg"
									width="236" height="200" /></a>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!--End 商品分类详情 End-->
			<ul class="menu_r">
				<li><a href="index">首页</a></li>
				<li><a href="Food.html">美食</a></li>
				<li><a href="Fresh.html">生鲜</a></li>
				<li><a href="HomeDecoration.html">家居</a></li>
				<li><a href="SuitDress.html">女装</a></li>
				<li><a href="MakeUp.html">美妆</a></li>
				<li><a href="Digital.html">数码</a></li>
				<li><a href="GroupBuying.html">学习</a></li>
			</ul>
			<div class="m_ad">中秋送好礼！</div>
		</div>
	</div>
	<!--End Menu End-->
</div>
</body>
</html>